<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>搜索框</title>
	</head>
	<body>
		<center>
		<!--onfocus获取光标事件-->
		<!--onblur失去光标事件-->
		<input type="search" id="se"onblur="blurT()"onfocus="foc()"/>
		<input type="button" value="搜索"/>
		</center>
	</body>
</html>
<script>
	//窗体加载事件
	window.onload=function()
	{
		//获取对象
		var ser = document.getElementById("se");
		ser.value="请搜索..."
		//修改字体颜色
		ser.style.color="rgba(202,208,210,0.5)";	
	}
	function foc()
	{
		//获取搜索框对象
		var ser=document.getElementById("se");
		//TimesDay timesDay驼峰命名法
		//判断输入框是否等于提示（请搜索...）
		if(ser.value=="请搜索...")
		{
			//清空数据
			ser.value="";
			//修改字体颜色
			ser.style.color="black";
		}
	}
	function blurT()
	{
		//获取当前搜索框对象
		var ser = document.getElementById("se");
		//如果没有值就返回请搜索...
		if(ser.value.trim()=="")
		{
			ser.value = "请搜索...";
			ser.style.color="rgba(202,208,210,0.5)";
		}
	}
</script>
